new Vue({
	el: '#mainBody',
	data: function () {
		return {
			showDialog: false,
			viewTitle: '',
			searchForm: {
				countDate: ''
			},
            searchJson:[]
		}
	},
	mounted: function () {
		this.countToday() 
    },
	methods: {
    	/**
         * 改变查询条件
         */
        changeSearch: function () {
        	var _this = this;
        	_this.searchJson = JSON.stringify(this.searchForm);
        	_this.searchCount();
        },
        /**
         * 统计日期为今天
         */
        countToday:function() {
        	var _this = this
        	var date = new Date()
        	var month = date.getMonth() + 1;
            var strDate = date.getDate();
            if (month >= 1 && month <= 9) {
                month = "0" + month;
            }
            if (strDate >= 0 && strDate <= 9) {
                strDate = "0" + strDate;
            }
            var currentDate = date.getFullYear() + "-" + month + "-" + strDate;
            $.ajax({
                url: '/countRatio/search/' + currentDate,
                type: 'post',
                dataType: 'json',
                beforeSend: function () {
                	$('.theme-loader').show()
                },
                success: function (res) {
                	_this.initEcharts(res.data)
                },
                complete: function () {
                	 $(".theme-loader").hide();
                },
                error: function (err) {
                	if(err.status == 403){
                        errorMessage(_this.$message, "没有权限，请先申请该权限！");
                        return;
                    }
                }
            })  
        },
        /**
         * 按查询条件统计
         */
        searchCount: function () {
        	var _this = this
        	var date = new Date()
        	var month = date.getMonth() + 1;
            var strDate = date.getDate();
            if (month >= 1 && month <= 9) {
                month = "0" + month;
            }
            if (strDate >= 0 && strDate <= 9) {
                strDate = "0" + strDate;
            }
            var currentDate = date.getFullYear() + "-" + month + "-" + strDate;
        	if(this.searchForm.countDate == '' || this.searchForm.countDate == null){
        		currentDate = date.getFullYear() + "-" + month + "-" + strDate;
        	}else{
        		currentDate = _this.searchForm.countDate;
        	}
        	 $.ajax({
                 url: '/countRatio/search/' + currentDate,
                 type: 'post',
                 dataType: 'json',
                 success: function (res) {
                 	_this.initEcharts(res.data)
                 },
                 error: function (err) {
                	 if(err.status == 403){
                         errorMessage(_this.$message, "没有权限，请先申请该权限！");
                         return;
                     }
                 }
             })
        },
        /**
         * 初始化echarts
         */
        initEcharts: function(data) {
        	console.log(data)
        	var myChart = echarts.init(document.getElementById('echarts'));
        	var option = {
                    title: {
                        text: '统计结果'
                    },
                    color: ['#EC897F', '#F6C4BF', '#f40000', '#A2DED0', '#928EA6', '#C9C7D3', '#c9c8aa'],
                    tooltip : {
                        trigger: 'axis',
                        axisPointer : {            // 坐标轴指示器，坐标轴触发有效
                            type : 'line'        // 默认为直线，可选为：'line' | 'shadow'
                        }
                    },
                    legend: {
                        data:data.legend
                    },
                    toolbox: {
                        // y: 'bottom',
                        feature: {
                            saveAsImage: {
                                pixelRatio: 2
                            }
                        },
                        right: 100
                    },
                    grid: {
                        left: '3%',
                        right: '4%',
                        bottom: '3%',
                        containLabel: true
                    },
                    xAxis: {
                        data: data.xAxis,
                        axisLabel: {

                            interval:0,

                            rotate:40

                         }
                    },
                    yAxis : [
                         {
                             type : 'value'
                         },
                         {
                             type : 'value'
                         }
                    ],
                    series : [
                          {
                              name:'内勤核心人数',
                              type:'bar',
                              stack: '内勤',
                              yAxisIndex : 0,
                              data:data.series_isOffice
                          },
                          {
                              name:'内勤非核心人数',
                              type:'bar',
                              stack: '内勤',
                              yAxisIndex : 0,
                              data:data.series_isNotOffice
                          },{
                              name: '核心内勤占比',
                              type: 'line',
                              yAxisIndex : 1,
                              data:data.series_officeRatio,
                              markLine: {
                                  data: [
                                      {type: 'average', name: '平均值'}
                                  ]
                              }
                          },{
                              name: '离职人数',
                              type: 'bar',
                              stack: '内勤',
                              yAxisIndex : 0,
                              data:data.series_isDimssion
                          },{
                              name:'上月内勤核心人数',
                              type:'bar',
                              stack: '上月内勤',
                              yAxisIndex : 0,
                              data:data.series_isOffice_last
                          },
                          {
                              name:'上月内勤非核心人数',
                              type:'bar',
                              stack: '上月内勤',
                              yAxisIndex : 0,
                              data:data.series_isNotOffice_last
                          },{
                              name: '上月离职人数',
                              type: 'bar',
                              stack: '上月内勤',
                              yAxisIndex : 0,
                              data:data.series_isDimssion_last
                          }
                  ]
                };
        	myChart.setOption(option);
        },
        /**
         * 导出统计结果Excel
         */
        downloadExcel: function(){
        	var _this = this
        	var date = new Date()
        	var month = date.getMonth() + 1;
            var strDate = date.getDate();
            if (month >= 1 && month <= 9) {
                month = "0" + month;
            }
            if (strDate >= 0 && strDate <= 9) {
                strDate = "0" + strDate;
            }
            var currentDate = date.getFullYear() + "-" + month + "-" + strDate;
        	if(this.searchForm.countDate == '' || this.searchForm.countDate == null){
        		currentDate = date.getFullYear() + "-" + month + "-" + strDate;
        	}else{
        		currentDate = _this.searchForm.countDate;
        	}
        	window.location.href='/countRatio/downloadExcel?data='+encodeURIComponent(currentDate);
        }
	}
})
